<!DOCTYPE html>
<html lang="en" class="page-fill" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>报价维护</title>
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all" />
    <script type="text/javascript"  th:src="@{/lib/layui/layui.js}"></script></head>
</head>
<body>
<div class="ok-body">
    <!--模糊搜索区域-->
    <div class="layui-row">
        <form class="layui-form layui-col-md12 ok-search">
            <input class="layui-input" placeholder="区间名称" autocomplete="off" name="rangeName">
            <button class="layui-btn" lay-submit="" lay-filter="search">
                <i class="layui-icon">&#xe615;</i>
            </button>
        </form>
    </div>
    <!--数据表格-->
    <table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
<!--js逻辑-->
<script th:inline="none">
    layui.use([ "element", "jquery", "table", "form"], function() {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;

        var userTable = table.render({
            elem : '#tableId',
            url : "/api/section/list",
            limit : 20,
            page : true,
            toolbar : true,
            toolbar : "#toolbarTpl",
            size : "sm",
            cols : [ [ {
                type : "checkbox",
                fixed : "left"
            }, {
                title : "区间编号",
                width : 160,
                templet:function(d){
                    return d.dsendingMaintenanceList.id;
                },
                sort : true
            }, {
                title : "区间名称",
                width : 100,
                templet:function(d){
                    return d.dsendingMaintenanceList.rangeName;
                }
            }, {
                title : "区间类型",
                width : 100,
                templet:function(d){
                    if (d.dsendingMaintenanceList.sectionType == 1) {
                        return "目的区间";
                    } else if (d.dsendingMaintenanceList.sectionType == 0) {

                        return "寄件区间";
                    }
                }
            }, {
                field : "str",
                title : "寄件/目的区间",
                width : 100
            }, {
                title : "备注",
                width : 100,
                templet:function(d){
                    return d.dsendingMaintenanceList.remark;
                }

            }, {
                field : "networkName",
                title : "维护网点",
                width : 100,

            }, {
                field : "staffName",
                title : "维护人",
                width : 100
            }, {
                title : "维护时间",
                width : 100,
                templet:function(d){
                    return d.dsendingMaintenanceList.servicingTime;
                }
            },{
                title : "操作",
                width : 200,
                align : "center",
                fixed : "right",
                templet : "#operationTpl"
            } ] ],
            done : function(res, curr, count) {
                console.info(res, curr, count);
            }
        });

        form.on("submit(search)", function(data) {
            userTable.reload({
                where : data.field,
                page : {
                    curr : 1
                }
            });
            return false;
        });

        table.on("toolbar(tableFilter)", function(obj) {
            switch (obj.event) {
                /*case "batchDel":
                    batchDel();
                    break;*/
                case "add":
                    add();
                    break;

            }
        });

        table.on("tool(tableFilter)", function(obj) {
            var data = obj.data;
            switch (obj.event) {
                case "edit":
                    edit(data.dsendingMaintenanceList.id);
                    break;
                case "check":
                    edit(data.dsendingMaintenanceList.id);
                    break;
                case "del":
                    del(data.dsendingMaintenanceList.id);
                    break;
            }
        });




        /*function batchDel() {
            okLayer.confirm("确定要批量删除吗？", function(index) {
                layer.close(index);
                var id = okUtils.tableDeleteBatchCheck(table, "id");
                if (id) {
                    okUtils.ajax("/api/section/delete", "post", {
                        id : id
                    }, true).done(function(response) {
                        console.log(response);
                        okUtils.tableSuccessMsg(response.msg);
                    }).fail(function(error) {
                        console.log(error)
                    });
                }
            });
        }*/





        function edit(data) {
            layui.layer.open({
                title : "更新信息",
                type : 2,
                area: ['750px','650px'],
                content : "/page/sectionUpdate/"+data,


        })
        }

        function add() {
            layui.layer.open({
                title : "新增信息",
                type : 2,
                area: ['750px','650px'],
                content : "/page/sectionAdd",
            })


        }


        /*function del() {
            layer.confirm("确定要删除吗？", function() {
                okUtils.ajax("/api/section/delete", "post", {
                    id : id
                }, true).done(function(response) {
                    console.log(response);
                    okUtils.tableSuccessMsg(response.msg);
                }).fail(function(error) {
                    console.log(error)
                });
            })
        }*/
    })
</script>
<!-- 头工具栏模板 -->
<script type="text/html" id="toolbarTpl">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDel">批量删除</button>
        <button class="layui-btn layui-btn-sm" lay-event="add">添加区间</button>
    </div>
</script>

<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
    <a href="javascript:" title="编辑" lay-event="edit"><i class="layui-icon">&#xe642;</i></a>
    <a href="javascript:" title="删除" lay-event="del"><i class="layui-icon">&#xe640;</i></a>
</script>


</body>
</html>
